<!DOCTYPE html>
<html lang="zh">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>登录显示数据</title>
</head>

<body>
  <button id="btn">提交</button>
  <p id="p" style="color: red;display: none;"></p>
  <script>
    document.getElementById('btn').addEventListener('click', async function () {
      const p = document.getElementById('p')
      let user = {
        flag: true
      };
      // 这个 await 请求的主要目的是将客户端的header等信息发给后端
      const res = await fetch(
        // 请求路径
        "http://localhost:3000/getdata",
        // 请求头
        {
          method: 'POST',
          headers: {
            'Content-Type': 'application/json'
          },
          // 请求体
          body: JSON.stringify(user)
        })
      // 这个await等待接收后端返回的数据
      const data = await res.json()
      if (data.status) {
        p.style.display = 'block'
        p.innerText = data.dataBody.moto
        console.log("success!");
        console.log(data)
      } else {
        p.style.display = 'block'
        p.innerText = '登录失败'
        console.log("error!");
      }
    })
  </script>
</body>

</html>